
//内外边距 全局统一 8、16、24、30、32
@for $i from 4 through 50 {
	@if $i % 8 == 0 or $i % 8 == 0 or $i % 14 == 0 or $i % 16 == 0 or $i % 20 == 0 or $i % 24 == 0 or $i % 30 == 0 or $i % 32 == 0 or $i % 40 == 0 or $i % 48 == 0 {
		.z-margin-#{$i} {
			margin: $i + rpx!important;
		}
		.z-margin-t-#{$i} {
			margin-top: $i + rpx !important;
		}
		.z-margin-b-#{$i} {
			margin-bottom: $i + rpx !important;
		}
		.z-margin-l-#{$i} {
			margin-left: $i + rpx !important;
    }
		.z-margin-r-#{$i} {
			margin-right: $i + rpx !important;
		}
		.z-margin-tb-#{$i} {
			margin-top: $i + rpx !important;
			margin-bottom: $i + rpx !important;
		}
		.z-margin-lr-#{$i} {
			margin-left: $i + rpx !important;
			margin-right: $i + rpx !important;
		}
		
		
		.z-padding-#{$i} {
			padding: $i + rpx!important;
		}
		.z-padding-t-#{$i} {
			padding-top: $i + rpx !important;
		}
		.z-padding-b-#{$i} {
			padding-bottom: $i + rpx !important;
		}
		.z-padding-l-#{$i} {
			padding-left: $i + rpx !important;
		}
		.z-padding-r-#{$i} {
			padding-right: $i + rpx !important;
		}
		.z-padding-tb-#{$i} {
			padding-top: $i + rpx !important;
			padding-bottom: $i + rpx !important;
		}
		.z-padding-lr-#{$i} {
			padding-left: $i + rpx !important;
			padding-right: $i + rpx !important;
		}
	}
}

//圆角 全局统一 8、16、20、30、50
@for $i from 4 through 50 {
	@if $i % 4 == 0 or $i % 8 == 0 or $i % 16 == 0 or $i % 20 == 0 or $i % 30 == 0 or $i % 50 == 0 {
		.z-radius-#{$i} {
			border-radius: $i + rpx!important;
		}
		.z-radius-tl-#{$i} {
			border-top-left-radius: $i + rpx !important;
		}
		.z-radius-tr-#{$i} {
			border-top-right-radius: $i + rpx !important;
		}
		.z-radius-bl-#{$i} {
			border-bottom-left-radius: $i + rpx !important;
		}
		.z-radius-br-#{$i} {
			border-bottom-right-radius: $i + rpx !important;
		}
		.z-radius-t-#{$i} {
			border-top-left-radius: $i + rpx !important;
			border-top-right-radius: $i + rpx !important;
		}
		.z-radius-b-#{$i} {
			border-bottom-left-radius: $i + rpx !important;
			border-bottom-right-radius: $i + rpx !important;
		}
	}
}

//字体大小 全局统一 22 24 28 30 32
@for $i from 18 through 48 {
	@if $i %18 == 0 or $i %20 == 0 or$i %22 == 0 or $i % 24 == 0  or $i % 26 == 0 or $i % 28 == 0 or $i % 30 == 0 or $i % 32 == 0 or $i % 40 == 0 or $i % 42 == 0  or $i % 48 == 0 {
		.z-font-#{$i} {
			font-size: $i + rpx!important;
		}
	}
}
.z-font-w{
	font-weight: bold;
}
.hidden{
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -o-text-overflow:ellipsis;
}
//flex常用布局
.z-flex{
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}
.z-flex-c{
  display: flex;
  align-items: center;
}
.z-flex-x-c{
	display: flex;
	justify-content: center;
}
.z-flex-x-s-b {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.z-flex-x-s-a {
	display: flex;
	justify-content: space-around;
	align-items: center;
}
.z-flex-y-c{
	display: flex;
	flex-direction: column;
	align-items: center;
}

.z-btn{
  background: #62CB81;
  color: #fff;
  border-radius: 10rpx;
  height: 98rpx;
  display: flex;
  align-items: center;
  justify-content: center;
}

.z-margin-t-100 {
	margin-top: 100rpx;
}
.z-text-l{
	text-align: left;
}
.z-text-r{
	text-align: right;
}
.z-text-c{
	text-align: center;
}
.text_666{
  color: #666;
}
.text_333{
  color: #333;
}
.text_999{
  color: #999;
}
.text-ash{
	color: #A9ADBB;
}
.text-price {
	color: #FF6C1F;
}
.green {
  color: #62CB81;
}

$z-color-main:#333333; 
$z-color-main-lower:#666666;
$z-color-assist:#999999;
$z-color-assist-lower:#999999;